 <div class="navbar navbar-fixed-top navbar-inverse" >
     <div id="navbar" class="container">
       <div class="navbar-header">
         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
           <span class="sr-only">Toggle navigation</span>
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
         </button>
         <a id="webbrand" class="navbar-brand" href="#">Treasure Hunter</a>
       </div>
       <div class="collapse navbar-collapse" ng-controller="headerController">
         <ul class="nav navbar-nav">
           <li ng-class="{ active: isActive('/maps')}"  id="navManageMap"><a ng-href="#/maps">Manage Map</a></li>
           <li ng-class="{ active: isActive('/chests')}" id="navManageChest"><a ng-href="#/chests">Chest Templates</a></li>
           <li ng-class="{ active: isActive('/treasures')}" id="navManageTreasure"><a ng-href="#/treasures">Treasure Templates</a></li>
           <li id="navManageHunter"><a href="#todo">Manage Hunters</a></li>
         </ul>
       </div><!-- /.nav-collapse -->
     </div><!-- /.container -->
   </div>